/**
 * 1. 创建对象
 */

var detail = {
	// 初始化
	init: function() {
		/**
		 * 1. 绑定事件
		 * 2. 获取数据
		 */
		// var id = sessionStorage.getItem('id');

		var id = common.getUrlParam('id');
		console.log('id是', id);
		this.bindEvent();
		this.getDetail(id);

	},

	// 绑定事件
	bindEvent: function() {
		// 绑定立即购买事件
		$('.buy').on('click', function() {
			detail.buyNow(event.target);
		});
		// 绑定加入购物车事件
		$('.addcar').on('click', function() {
			detail.addCar();
		})
	},

	// 渲染页面,把数据显示到页面
	render: function(data) {
		var htmlStr = `
			<div class="img-box">
				<img id="phone-img" src="${data.imgUrl}" alt="图片加载中...">
			</div>
			<div class="detail" id="detail">
			<p class="prdname"><span id="prdName">${data.prdName}</span> <span id="disc"></span></p>
			<p class="price">价格 ¥ ${data.price.toFixed(2)} 包邮</p>
			<p class="send">配送 ${data.address} 免运费 24小时内发货</p>
			<p class="prdcolor">机身颜色 红色 金色（全网通）玫瑰金（全网通）</p>
			<p class="prdstore">存储容量 ${data.capacity}g</p>
			<p class="prdstore">库存 剩余${data.stock}件</p>
							<p class="submit-box">
					<button class="buy">立即购买</button>
					<button class="addcar">加入购物车</button>
				</p>
			</div>
			`;
			$('#main').html(htmlStr);
		
	},

	// 立即购买事件的处理函数
	buyNow: function(target) {
		alert('立即购买');
		// 处理立即购买的具体逻辑
	},

	// 加入购物车处理事件(监听器)
	addCar: function() {
		alert('加入到购物车')
	},

	// 获取详情数据
	getDetail: function(id) {
		var url = 'https://www.easy-mock.com/mock/5b67edb475d70b78bbc6212e/xinyan/getDetail';
		var data = {
			id: id
		};
		common.loadingBegin();
		$.ajax({
			type: "get",
			url: url,
			data: data,
			// 成功后的回调
			success: function(res) {
				console.log(res);
				detail.render(res.data);
			},
			error: function() {
				alert('网络异常,请稍后再试');
			},
			// 所有事情都完成的回调
			complete: function() {
				common.loadingFinish();
			}
		});
	}
}

detail.init();